.map {
  width: 100%;
  height: 100%;
}

.map-left {
  position: absolute !important;
  //height: 87.5vh!important;
  top: 0.242vw;
  bottom: 0.242vw;
  left: 1.04vw;
  width: 27.5vw;
  //color: #74a7d1;
  .section-menu {
    flex: 0 0 1.56vw;

    div {
      width: auto;
      height: 2vw;
      font-weight: 700;
      background-size: 100% 100%;
      margin-left: 1.2vw;
      padding-top: 0.2vw;
      box-sizing: border-box;
    }

    .sectionActive {
      color: #fff;
      background-image: url("../../assets/images/bdh/titleActive.png");
      background-size: 100% 100%;
    }

    .sectionNotActive {
      background-image: url("../../assets/images/bdh/titleNotActive.png");
      background-size: 100% 100%;
    }
  }

  .map-left-time-box {
    height: 32px;
    flex: 0 0 32px;
  }
}

.map-right {
  position: absolute !important;
  top: 0.242vw;
  bottom: 0.242vw;
  right: 1.04vw;
  overflow: auto;
  //height: 87.5vh!important;
  min-width: 27.5vw;
  max-width: 27.5vw;

  .map-el-table-cont {
    overflow-y: auto;
  }
}

.map-center-top {
  position: absolute !important;
  height: 5.82vh !important;
  top: 0.242vw;
  display: flex;
  justify-content: space-evenly;
  //margin-top: 5px;

  .map-center-top-row {
    flex: 1;
    height: auto;
    margin-right: 10px;
    border: 1px solid #0c4667;
    font-size: 1vw;
    text-align: center;
    font-weight: 700;
    background-color: #0a2e46;
    color: #0e6fa9;
    display: flex;
    justify-content: center;
    align-items: center;

    img {
      vertical-align: middle;
      display: inline-block;
      margin-right: 0.1vw;
      width: 2vw;
      height: 2vw;
    }
  }

  .stationActive {
    color: #fff;
    width: 10vw;
    height: auto;
    background: url("../../assets/images/HY/selectbox.png") center no-repeat;
    background-size: 100% 100%;
    // background-image: linear-gradient(0deg, #0a94ff 0%, #0144de 100%),
    //                   linear-gradient(#175dd0, #175dd0);
    // background-blend-mode: normal, normal;
  }
}

.section-cont {
  text-align: center;
  font-size: 0.73vw;
  color: #b7d0e2;
  cursor: pointer;

  .sectionNum {
    display: inline-block;
    margin-top: 5px;
    font-size: 0.94vw;
  }
}

.sectionDataActive {
  color: #fff;
  background: rgb(17, 167, 249);
}

.sectionDataActives {
  color: #fff;
  background-image: linear-gradient(0deg, #0a94ff 0%, #26231E 100%),
  linear-gradient(#0A85F4, #0A85F4);
  background-blend-mode: normal, normal;
}

.fold-btn-l {
  position: absolute;
  top: 50%;
  left: 18.5vw;
  z-index: 1;
  width: 22px;
  height: 35px;
  line-height: 35px;
  text-align: center;
  background: #11A7F9;
  font-size: 14px;
  color: #fff;
  cursor: pointer;
}

.fold-l-close {
  left: 0;
}

.fold-btn-r {
  position: absolute;
  top: 50%;
  right: 28.542vw;
  z-index: 1;
  width: 22px;
  height: 35px;
  line-height: 35px;
  text-align: center;
  background: #11A7F9;
  font-size: 14px;
  color: #fff;
  cursor: pointer;
}

.fold-r-close {
  right: 0 !important;
}

.fold-r-closes {
  right: 1.242vw !important;
}

.height10 {
  height: 10%;
  flex: 0 0 10%;
}

.height20 {
  height: 20%;
  flex: 0 0 20%;
}

.height21 {
  height: 21%;
  flex: 0 0 21%;
}

.height22 {
  height: 22%;
  flex: 0 0 22%;
}

.height23 {
  height: 23%;
  flex: 0 0 23%;
}

.height24 {
  height: 24%;
  flex: 0 0 24%;
}

.height25 {
  height: 25%;
  flex: 0 0 25%;
}

.height26 {
  height: 26%;
  flex: 0 0 26%;
}

.height27 {
  height: 27%;
  flex: 0 0 27%;
}

.height28 {
  height: 28%;
  flex: 0 0 28%;
}

.height29 {
  height: 29%;
  flex: 0 0 29%;
}

.height30 {
  height: 30%;
  flex: 0 0 30%;
}

.height31 {
  height: 20%;
  flex: 0 0 20%;
}

.height31_ {
  height: 15%;
  flex: 0 0 15%;
}

.height32 {
  height: 32%;
  flex: 0 0 32%;
}

.height33 {
  height: 33%;
  flex: 0 0 33%;
}

.height34 {
  height: 34%;
  flex: 0 0 34%;
}

.height35 {
  height: 35%;
  flex: 0 0 35%;
}

.height36 {
  height: 36%;
  flex: 0 0 36%;
}

.height37 {
  height: 37%;
  flex: 0 0 37%;
}

.height38 {
  height: 38%;
  flex: 0 0 38%;
}

.height40 {
  height: 40%;
  flex: 0 0 40%;
}

.height42 {
  height: 42%;
  flex: 0 0 42%;
}

.height58 {
  height: 58%;
  flex: 0 0 58%;
}

.height50 {
  height: 50%;
  flex: 0 0 50%;
}

.height60 {
  height: 60%;
  flex: 0 0 60%;
}

.height65 {
  height: 60%;
  flex: 0 0 65%;
}

.height70 {
  height: 70%;
  flex: 0 0 70%;
}

.height80 {
  height: 80%;
  flex: 0 0 80%;
}

.height90 {
  height: 90%;
  flex: 0 0 90%;
}

.width50 {
  width: 50%;
  flex: 0 0 50%;
}

/* 时间轴样式 */
.esriTimeSlider {
  table tr td {
    text-align: center;
  }

  .dijitButtonNode {
    border: none;
  }

  .tsTmp {
    vertical-align: top;
    padding-top: 5px;
  }

  .dijitSliderBumperH,
  .dijitSliderBarH {
    height: 6px;
  }

  .dijitSliderLeftBumper,
  .dijitSliderRightBumper {
    background: transparent;
  }

  .dijitSliderRemainingBar {
    background: #3db4ff;
    opacity: 0.25;
  }

  .dijitSliderProgressBar {
    background: #3db4ff;
  }

  .dijitSliderImageHandle {
    border: none;
    width: 4px;
    height: 16px;
    background: #ff8f3d;
    border-radius: 2px;
  }

  .dijitRuleMark {
    border-color: rgba(255, 255, 255, 0.3);
  }

  .dijitRuleLabel {
    white-space: nowrap;
  }
}
